Custom cache provider #1017

huozhi · 2021-03-07T04:42:50Z

Changes

This PR is a early phase implementation for #728 . Add cache property as a cache provider to SWR context

import { createCache } from 'swr'

const customCache = new Map()
const { cache } = createCache(customCache)

<SWRConfig value={{ cache }}>
   <Section />
<SWRConfig>

This is the early support of #16 , user can have a way to access the cache state and changes ( #630 ), but won't effect swr internal cache. For example, you can use any store like localStorage / RN AsyncStorage, swr internal will still use a sync cache to guarantee the correct state updating sequence.

In the long term, we can consider to deprecate the exposed cache

Example

import { createCache } from 'swr'

const localStorageCache = {
   set(key, value) {
      window.localStorage.setItem(key, JSON.stringify(value))
   },
   delete(key) {
    window.localStorage.removeItem(key)
  },
}

const { cache } = createCache(localStorageCache)

return <SWRConfig value={{ cache }}>

codesandbox-ci · 2021-03-07T04:43:17Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit e8c21fa:

Sandbox	Source
SWR-Basic	Configuration
SWR-States	Configuration
SWR-Infinite	Configuration
SWR-SSR	Configuration

bionicles · 2021-03-08T15:14:52Z

Might it be better to use the Cache API? it persists the data to apps installed locally on mobile devices, and it works inside WebWorkers https://developer.mozilla.org/en-US/docs/Web/API/Cache

https://caniuse.com/?search=cache

also, what about customizing the "get" in addition to the "set" ?

usage examples in readme would be helpful to adopt this

shuding

Generally LGTM! 👍

Since this is breaking and deprecates Cache, we need to first prepare a PR to add @deprecates to Cache for 0.x versions.

Secondly since we don't need to expose Cache anymore, I think we shouldn't wrap the provider with a class. We can just use a couple of lightweight functions:

function get(provider, key) { return provider.get(key) }
function set(provider, key, value) { return provider.set(key, value) }

And we don't need those internal listeners too. This change will be useful when we pass the provider down via context, and we don't maintain the cache singleton itself inside SWR.

huozhi · 2021-03-16T16:48:22Z

5834b59 latest change:

limit cache API usage inside swr, only using set/get/delete, and they're all sync APIs.

for global mutate and trigger, use const cache = globalCache to consume global cache directly;
for useSWR hook, it will consume provider from context or fallback to global cache.

shuding · 2021-04-04T16:07:19Z

I refactored the API a little bit:

const { cache, mutate } = createCache(provider)

But the implementation is still not ideal:

~~The interface of provider. Should we do serialization inside or assume it's always a string?~~
The internal code structure. use-swr depends on use-args, use-args depends on the default config and cache, but the default cache depends on use-swr. So I had to choose a strange way to implement this (defaultCache = getCacheFactory(() => {})(new Map()).cache).

I need to spend some more time thinking about it. I also moved web presets out of the default config object, because these can not be options. But I'm not very sure about that decision, let me know what you think!

shuding · 2021-04-05T18:27:27Z

While the main goal of this PR is to better cover testing scenarios, there're still a couple of to-dos left (no blocking this PR to be merged, just writing them down):

Add a test case for multi-level cache + mutation
Add a test case for multi-cache isolation (2 components with different cache provider)
Need to make sure that cache doesn't change. Maybe by adding a useEffect to show a warning inside useArgs...? This needs to be done when we have dev/prod separated builds, so prod can strip many unnecessary things out such as useDebugValue.

huozhi

@shuding new changes genterally LGTM! you might also want to fix those lint warnings.

src/types.ts

src/use-swr.ts

shuding

🎉🎉🎉

huozhi force-pushed the custom-cache branch 2 times, most recently from 9f68e6d to 5395cd2 Compare March 8, 2021 13:26

shuding reviewed Mar 9, 2021

View reviewed changes

huozhi force-pushed the custom-cache branch from 549c98b to 7fad1a8 Compare March 9, 2021 12:28

huozhi force-pushed the custom-cache branch from 7fad1a8 to 5834b59 Compare March 16, 2021 16:41

custom cache

5834b59

huozhi requested a review from shuding March 16, 2021 16:43

huozhi marked this pull request as ready for review March 16, 2021 16:50

huozhi requested a review from pacocoursey as a code owner March 16, 2021 16:50

huozhi and others added 4 commits March 19, 2021 21:07

deprecate cache comment

05c955d

Merge remote-tracking branch 'upstream/master' into custom-cache

9644b7e

Merge branch 'master' into custom-cache

271e0e1

tweak the createCache api

46a1e8f

shuding added 3 commits April 5, 2021 22:22

refactor createCache

69ec9df

merge master

fb0fea6

simplify cache interface

18eac1f

shuding changed the title ~~Custom Cache (Experimental)~~ Custom cache provider Apr 5, 2021

shuding added 2 commits April 6, 2021 01:34

improve tests

90f4f55

resolve conflicts

0b23bec

shuding mentioned this pull request Apr 6, 2021

SWR cache persistent across tests even with cache clearing and deduping interval at 0 #781

Closed

huozhi commented Apr 6, 2021

View reviewed changes

src/types.ts Show resolved Hide resolved

huozhi commented Apr 6, 2021

View reviewed changes

src/use-swr.ts Show resolved Hide resolved

bind swr state to the cache object; simplify internal logic

47de697

shuding added this to the 1.0 milestone Apr 13, 2021

shuding mentioned this pull request Apr 13, 2021

fix: cache initial data #388

Closed

huozhi added 2 commits April 29, 2021 16:01

Merge branch 'master' into custom-cache

37c699b

fix merge errors and add cache to deps

5fcde9d

shuding reviewed May 1, 2021

View reviewed changes

src/use-swr.ts Outdated Show resolved Hide resolved

shuding added 6 commits May 2, 2021 14:27

remove deps

35f7ec4

revert preset changes

e5bd7d0

refactor code

9a610c7

refactor code

2242b85

add multi-level cache test

411e6a2

add isolated cache test

e8c21fa

shuding approved these changes May 2, 2021

View reviewed changes

shuding merged commit b38d1bd into vercel:master May 2, 2021

huozhi deleted the custom-cache branch May 2, 2021 07:14

shuding mentioned this pull request May 6, 2021

Feature request: Add maxAge option for cached values #258

Closed

NOUIY mentioned this pull request May 17, 2024

[Snyk] Upgrade immer from 9.0.5 to 9.0.21 NOUIY/swr#148

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Custom cache provider #1017

Custom cache provider #1017

huozhi commented Mar 7, 2021 •

edited

Loading

codesandbox-ci bot commented Mar 7, 2021 •

edited

Loading

bionicles commented Mar 8, 2021 •

edited

Loading

shuding left a comment

huozhi commented Mar 16, 2021

shuding commented Apr 4, 2021 •

edited

Loading

shuding commented Apr 5, 2021 •

edited

Loading

huozhi left a comment •

edited

Loading

shuding left a comment

Custom cache provider #1017

Custom cache provider #1017

Conversation

huozhi commented Mar 7, 2021 • edited Loading

Changes

Example

codesandbox-ci bot commented Mar 7, 2021 • edited Loading

bionicles commented Mar 8, 2021 • edited Loading

shuding left a comment

Choose a reason for hiding this comment

huozhi commented Mar 16, 2021

shuding commented Apr 4, 2021 • edited Loading

shuding commented Apr 5, 2021 • edited Loading

huozhi left a comment • edited Loading

Choose a reason for hiding this comment

shuding left a comment

Choose a reason for hiding this comment

huozhi commented Mar 7, 2021 •

edited

Loading

codesandbox-ci bot commented Mar 7, 2021 •

edited

Loading

bionicles commented Mar 8, 2021 •

edited

Loading

shuding commented Apr 4, 2021 •

edited

Loading

shuding commented Apr 5, 2021 •

edited

Loading

huozhi left a comment •

edited

Loading